  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
  </head>
  <body>
      
  </body>
  </html>
   <!-- - #笔记要求

    ##笔记
    - 每日边看视频边记录笔记，然后每个知识点需要自己解释一下
    - 以及 每日未解决的问题可以记录下来
    - 记录每日完成多少代码量（多少行）
    - 今天做了什么
    有做项目的话，项目的进度 -->
    浮动：
浮动奇数允许元素浮动到另外一个元素的左侧或右侧，而不是默认的一个堆叠另一个。
float主要用途是布置出多个列并且浮动文字以环绕图片。
float 属性有四个可能的值：
   left - 将元素浮动到左侧
  right - 将元素浮动到右侧
   none - 默认值，不浮动
inherit - 继承父元素的浮动属性

定位技术（position）允许我们将一个元素从它在页面的原始位置准确的移动到另一个位置

静态定位（Static positioning）是每个元素默认的属性--他表示“将元素放在文档布局流的默认位置--没有什么特殊的地方”

相对定位（Relative positioning）允许我们相对于元素在正常的文档流中的位置移动它--包括将两个元素叠放在页面上

绝对定位（Absolute positioning）将元素全从页面的正常布局流中移出，类似将它单独放在一个图层中.

固定定位（Fixed positioning）与绝对定位非常类似，除了它是将一个元素相对浏览器视口固定，而不是相对另外一个元素.

相对定位 相对定位通常用来对布局进行微调
定位上下文 取决于绝对定位元素的父元素position属性 如果所有元素都没有显示定义position属性那么父元素默认情况下position属性都是static
多列浮动布局 浮动通常用于创建多个列布局
两个列布局（two-colum.html）所有列使用宽度百分比，另一种选择是将宽度设置为一个固定单位
三列布局（three-colum.html）尝试改变第二列的float值为right
left：停止任何活动的左浮动
righ：停止任何活动的右浮动
both：停止任何活动的左右浮动